<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head th:include="include :: header"></head>
<link href="/ajax/libs/datapicker/datepicker3.css"
	th:href="@{/ajax/libs/datapicker/datepicker3.css}" rel="stylesheet" />
<link href="/ajax/libs/iCheck/custom.css"
	th:href="@{/ajax/libs/iCheck/custom.css}" rel="stylesheet" />
<link href="/ajax/libs/select/select2.css"
	th:href="@{/ajax/libs/select/select2.css}" rel="stylesheet" />
<link href="/azxcrm/css/azxcrm.css" th:href="@{/azxcrm/css/azxcrm.css}"
	rel="stylesheet" />
<body class="gray-bg">
	<div class="wrapper wrapper-content animated fadeInRight ibox-content">
		<form class="form-horizontal m" id="form-customerInfo-add">
			<div class="form-group">
				<label class="col-sm-3 control-label">姓名：</label>
				<div class="col-sm-8">
					<input id="name" name="name" class="form-control" type="text">
				</div>
			</div>

			<div class="form-group">
				<label class="col-sm-3 control-label">手机号码：</label>
				<div class="col-sm-8">
					<input id="cellphone" name="cellphone" class="form-control"
						type="text" maxlength="11" onblur="Tel(this,this.value)">
				</div>
			</div>

			<div class="form-group">
				<label class="col-sm-3 control-label">年龄：</label>
				<div class="col-sm-8">
					<input id="age" name="age" class="form-control" type="number" onkeyup="this.value=this.value.replace(/\D/g,'')" 
					onafterpaste="this.value=this.value.replace(/\D/g,'')" maxlength="3">
				</div>
			</div>

			<div class="form-group">
				<label class="col-sm-3 control-label">性别：</label>
				<div class="col-sm-8">
					<div class="radio radio-success radio-inline">
						<input type="radio" id="radio2" name="sex" value="1"> 
						<label for="radio1">男</label>
					</div>
					<div class="radio radio-danger radio-inline">
						<input type="radio" id="radio3" name="sex" value="2"> 
						<label for="radio2">女</label>
					</div>
				</div>
			</div>

			<div class="form-group">
				<label class="col-sm-3 control-label">客户背景：</label>
				<div class="col-sm-8">
					<select id="backgroundId" name="backgroundId" class="form-control">
						<option value="" selected="selected">请选择</option>
						<option th:each="list : ${list}" th:value="${list.dictCode}"
							th:text="${list.dictLabel}"></option>
					</select>
				</div>
			</div>

			<div class="form-group">
				<label class="col-sm-3 control-label">客户学历：</label>
				<div class="col-sm-8">
					<select id="education" name="education" class="form-control">
						<option value="" selected="selected">请选择</option>
						<option th:each="education : ${educationList}" th:value="${education.dictCode}"
							th:text="${education.dictLabel}"></option>
					</select>
				</div>
			</div>

			<div class="form-group">
				<label class="col-sm-3 control-label">客户职业：</label>
				<div class="col-sm-8">
					<select id="job" name="job" class="form-control">
						<option value="" selected="selected">请选择</option>
						<option th:each="job : ${jobList}" th:value="${job.dictCode}"
							th:text="${job.dictLabel}"></option>
					</select>
				</div>
			</div>

			<div class="form-group">
				<label class="col-sm-3 control-label">出生日期：</label>
				<div class="col-sm-9">
					<div class="form-group">
						<div class="input-group date">
							<span class="input-group-addon"><i class="fa fa-calendar"></i></span>
							<input name="birth" type="text" class="form-control"
								value="">
						</div>
					</div>
				</div>
			</div>

			<div class="form-group">
				<label class="col-sm-3 control-label">电话号码：</label>
				<div class="col-sm-8">
					<input id="phoneNum" name="phoneNum" class="form-control"
					    onblur="isTel(this,this.value)"
						type="text"  maxlength="12">
				</div>
			</div>

			<div class="form-group">
				<label class="col-sm-3 control-label">身份证号：</label>
				<div class="col-sm-8">
					<input id="identityNum" name="identityNum" class="form-control"
						type="text" maxlength="18" onblur="isCardNo(this,this.value)">
				</div>
			</div>

			<div class="form-group">
				<label class="col-sm-2 control-label">所在地址 </label>
				<div class="col-sm-3">
					<select name="province" id="input_province" class="form-control">
						<option value="">--请选择--</option>
					</select>
				</div>
				<div class="col-sm-3">
					<select name="city" id="input_city" class="form-control">
						<option value="">--请选择--</option>
					</select>
				</div>
				<div class="col-sm-3">
					<select name="area" id="input_area" class="form-control">
						<option value="">--请选择--</option>
					</select>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">地址详情：</label>
				<div class="col-sm-8">
					<input id="addressDetail" name="addressDetail" class="form-control"
						type="text">
				</div>
			</div>

			<div class="form-group">
				<div class="col-sm-8 col-sm-offset-3">
					<button type="submit" class="btn btn-primary">提交</button>
				</div>
			</div>
		</form>
	</div>
	<div th:include="include::footer"></div>
	<script src="/azxcrm/module/customerInfo/add.js"
		th:src="@{/azxcrm/module/customerInfo/add.js}"></script>
	<script src="/js/jquery-ui-1.10.4.min.js"
		th:src="@{/js/jquery-ui-1.10.4.min.js}"></script>
	<script src="/ajax/libs/iCheck/icheck.min.js"
		th:src="@{/ajax/libs/iCheck/icheck.min.js}"></script>
	<script src="/ajax/libs//datapicker/bootstrap-datepicker.js"
		th:src="@{/ajax/libs//datapicker/bootstrap-datepicker.js}"></script>
	<script src="/ajax/libs/beautifyhtml/beautifyhtml.js"
		th:src="@{/ajax/libs/beautifyhtml/beautifyhtml.js}"></script>
	<script src="/ajax/libs/select/select2.js"
		th:src="@{/ajax/libs/select/select2.js}"></script>
	<script>
		$(".input-group.date").datepicker({
			todayBtn : "linked",
			keyboardNavigation : !1,
			forceParse : !1,
			calendarWeeks : !0,
			autoclose : !0
		});
	    function Tel(obj,val){
	        var myreg=/^[1][3,4,5,7,8][0-9]{9}$/;
	        if(!myreg.test(val)){
	          layer.msg('请输入正确的手机号码')
	        }else{
	          return true;
	        }
	      }
		//身份证验证
		function isCardNo(obj,card) { 
		    var reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/; 
		    if(reg.test(card) === false)  {        
		          layer.msg('请输入正确的身份证号码')
		    } 
		}

		//固定电话
		function isTel(obj,card){
		    var reg = /^(\(\d{3,4}\)|\d{3,4}-)?\d{7,8}$/; 
		     if(reg.test(card) === false)  {        
		          layer.msg('请输入正确的电话号码')
		     } 
		}
	</script>
	<script src="/js/address.js" th:src="@{/js/address.js}"></script>
</body>
</html>
